<template>
	<view class="input-select-end">
		<uni-combox v-model="val" @input='querySearchAsync' :candidates="selectOptions" placeholder="中文" @select='select'
		 value='senderName'></uni-combox>
		<u-icon name='close-circle' :size='40' @click="clear"></u-icon>
	</view>
</template>

<script>
	import UniCombox from '@/components/uni-combox/uni-combox.vue'

	export default {
		name: "InputSelectEnd",
		props: {
			value: {
				type: String
			},
			that: {
				type: Object
			}
		},
		data() {
			return {
				val: '',
				selectOptions: []
			}
		},
		watch: {
			value(val, old) {
				if (val && !old) { // 第一次输入执行
					this.val = val;
				}
				if (!val && this.val) { // 只有外边清空才执行
					this.val = '';
				}
			}
		},
		methods: {
			clear() {
				let _this = this.that;
				_this.form.receiverName = ''; // 收件人姓名
				_this.form.laosReceiverName = '';
				_this.form.endPlace = ''; // 目的地
				_this.form.laosEndPlace = '';
				_this.form.receiverCompanyName = ''; // 收件单位名称
				_this.form.laosReceiverCompanyName = '';
				_this.form.receiverAddress = ''; // 收件人详细地址
				_this.form.laosReceiverAddress = '';
				_this.form.receiverPhone = ''; // 收件人联系电话
				_this.form.receiverId = ''; // 收件人证件号
			},
			set(obj) {
				let _this = this.that;
				_this.form.receiverName = obj.receiverName; // 收件人姓名
				_this.form.laosReceiverName = obj.laosReceiverName;
				_this.form.endPlace = obj.endPlace; // 目的地
				_this.form.laosEndPlace = obj.laosEndPlace;
				_this.form.receiverCompanyName = obj.receiverCompanyName; // 收件单位名称
				_this.form.laosReceiverCompanyName = obj.laosReceiverCompanyName;
				_this.form.receiverAddress = obj.receiverAddress; // 收件人详细地址
				_this.form.laosReceiverAddress = obj.laosReceiverAddress;
				_this.form.receiverPhone = obj.receiverPhone; // 收件人联系电话
				_this.form.receiverId = obj.receiverId; // 收件人证件号
			},
			select(val) {
				this.val = val.receiverName;
				this.$emit('input', val.receiverName);
				this.$parent.$emit('el.form.change');
				this.set(val);
				this.selectOptions = [];
			},
			querySearchAsync(query) {
				setTimeout(() => {
					this.$emit('input', query);
					this.$parent.$emit('el.form.change');
					if (!query) {
						this.selectOptions = []
						return
					}
					let data = {
						senderName: '',
						receiverName: query
					};
					this.$api.listByNameApi(data).then(result => {
						result.resultParam.expressOrderList.forEach(item => {
							item.label = item.receiverName + " --- " + item.receiverPhone
							item.value = item.receiverName
						})
						/* 去重 */
						let arr = result.resultParam.expressOrderList
						for (let i = 0; i < arr.length; i++) {
							for (let j = i + 1; j < arr.length; j++) {
								if (arr[i].receiverName === arr[j].receiverName && arr[i].receiverPhone === arr[j].receiverPhone) {
									arr.splice(j, 1);
									j--;
								}
							}
						}
						/* 去重 */
						this.selectOptions = arr
					})
				})
			}
		}
	}
</script>

<style lang="scss">
	.input-select-end {
		display: flex;
	}
</style>
